<template>
	<!-- 总公司直联核保复审工作列表-直联核保列表页面 -->
	<div class="fillcontain">
		<el-form :model="searchParams" ref="ruleForm" label-width="130px" class="search_container">
			<el-row>
				<el-col :span="6">
					<el-form-item label="投保人姓名" prop="cownname">
						<el-input v-model="searchParams.cownname" placeholder="投保人姓名" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="投保人证件号码" prop="cownid">
						<el-input v-model="searchParams.cownid" placeholder="投保人证件号码" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="被保人姓名" prop="insuredname">
						<el-input v-model="searchParams.insuredname" placeholder="被保人姓名" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="被保人证件号码" prop="insuredid">
						<el-input v-model="searchParams.insuredid" placeholder="被保人证件号码" clearable></el-input>
					</el-form-item>
				</el-col>
				<!-- <el-col :span="6">
					<el-form-item label="任务号" prop="taskno">
						<el-input v-model="searchParams.taskno" placeholder="任务号" clearable></el-input>
					</el-form-item>
				</el-col> -->
				<el-col :span="6">
					<el-form-item label="电子流水号" prop="docno">
						<el-input v-model="searchParams.docno" placeholder="电子标识号" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="任务状态" prop="procecode">
						<el-select v-model="searchParams.procecode" placeholder="任务状态">
							<el-option v-for="item in routeids" :key="item.value" :label="item.name" :value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="8" class="text_right" style="float: right;">
					<el-button type="primary" icon="el-icon-search" @click="search"></el-button>
					<el-button type="primary" plain icon="el-icon-refresh" @click="resetSearch"></el-button>
				</el-col>
			</el-row>
		</el-form>
		<div class="contain">
			<div class="table_container">
				<div style="margin-bottom: 10px;">
					<el-button type="danger" style="margin-left: 10px;" plain @click="addLock">加锁</el-button>
					<el-button type="danger" plain @click="unLock">解锁</el-button>
				</div>
				<el-table v-loading="loading" :data="tableData" @selection-change="handleSelectionChange" highlight-current-row header-cell-class-name="table-header-class" :row-style="rowStyle" @row-dblclick="goRoutePath" style="width:100%">
					<el-table-column type="selection"></el-table-column>
					<el-table-column min-width="100" property="checkoutusrid" label="检出人" align='center' sortable  show-overflow-tooltip>
					</el-table-column>
					<!-- <el-table-column min-width="230" property="taskno" label="任务号" align='center' show-overflow-tooltip>
					</el-table-column> -->
					<el-table-column min-width="230" property="docno" label="电子标识号" align='center' show-overflow-tooltip>
					</el-table-column>
					<el-table-column min-width="100" property="cownname" label="投保人姓名" align='center' show-overflow-tooltip>
					</el-table-column>
					<!-- <el-table-column min-width="190" property="cownid" label="投保人证件号码" align='center' show-overflow-tooltip>
					</el-table-column> -->
					<el-table-column min-width="100" property="insuredname" label="被保人姓名" align='center' show-overflow-tooltip>
					</el-table-column>
					<!-- <el-table-column min-width="190" property="insuredid" label="被保人证件号码" align='center' show-overflow-tooltip>
					</el-table-column> -->
					<el-table-column min-width="190" property="riskname" label="险种名称" align='center' show-overflow-tooltip>
					</el-table-column>
					<el-table-column min-width="190" property="polpln" label="险种代码" align='center' show-overflow-tooltip>
					</el-table-column>
					<el-table-column min-width="100" property="procecodeCHN" label="任务状态" align='center' show-overflow-tooltip>
					</el-table-column>
					<el-table-column min-width="160" property="createTime" label="任务启动时间" align='center' show-overflow-tooltip>
					</el-table-column>
					<el-table-column min-width="160" property="lastUpdateTime" label="最近处理时间" align='center' show-overflow-tooltip>
					</el-table-column>
					<el-table-column min-width="80" label="流转记录" align='center' show-overflow-tooltip>
						<template slot-scope="scope">
							<el-button type="text" size="small" @click="showChange(scope.row.taskno)" :disabled="(scope.row.taskno != '' && scope.row.taskno != undefined) ? false : true">流转记录</el-button>
						</template>
					</el-table-column>
					<el-table-column min-width="120" label="预投保资料" align='center' show-overflow-tooltip>
						<template slot-scope="scope">
							<router-link style="color:#7FC1FD;" :to="{path: '/home/taskCenter/pre/directUnderwriteQueryDetail/'+ scope.row.seqnum + '/' + scope.row.procecode}">详情</router-link>
						</template>
					</el-table-column>
				</el-table>
				<el-row>
					<el-col :span="24">
						<div class="pagination">
							<el-pagination background v-if='paginations.total > 0' :page-sizes="paginations.pageSizes" :page-size="paginations.pageSize"
							 :layout="paginations.layout" :total="paginations.total" :current-page='paginations.pageIndex' @current-change='handleCurrentChange'
							 @size-change='handleSizeChange'>
							</el-pagination>
						</div>
					</el-col>
				</el-row>
			</div>
		</div>

		<!-- 流转/修改记录 -->
		<directTaskRoutingList :business="'NB'" :taskNo="changeTaskNo" :drawer="showChangeFlag" @close="hideChange"></directTaskRoutingList>

	</div>
</template>

<script>
	import transformation from "@/utils/transformation/qualityInspection"; // 数据翻译
	import {
		mapGetters
	} from 'vuex'
	import constant from '@/utils/constant'; // 通用参数
	import {getSsyOrgMap,warnOutSty} from '@/api/taskCenter/taskCommon'; // 任务中心接口定义
	import TaskConstants, {
		call
	} from "@/api/taskManager/common" // 通用AXIOS请求：GET/POST
	import directTaskRoutingList from './directTaskRoutingList' // 任务流转组件
	import {
		queryPreUnderApi,addLockApi,unLockApi,queryLockStatusApi
	} from "@/api/taskCenter/directUnderwriteList"; //调接口
	import { getToken } from '@/utils/auth' // 验权(从cookie中获取)

	export default {
		name:'directUnderwriteQuery',
		components: {
			directTaskRoutingList
		},
		data() {
			return {
				intervalQuery : "",
				changeTaskNo: "",
				showChangeFlag: false,
				multipleSelection: [], // 选中的数据
				searchParams: {
					cownname : '', // 投保人姓名
					cownid : '', // 投保人证件号码
					insuredname : '', // 被保人姓名
					insuredid : '', // 被保人证件号码
					procecode:'C', // 任务状态下拉框默认值
					taskno: '', // 任务号
					docno: '', // 电子流水号
					userId:'', // 用户ID
					userName:'', // 用户名称
				},
				userInfo:{}, // 存储用户信息
				routeids:[{
					name:'复核',
					value:'C'
				},{
					name:'已结案',
					value:'Z'
				}],
				preTasks: TaskConstants.preTasks,
				preChannels: TaskConstants.preChannelType,
				emptySearchParams: {},
				tableData: [],
				ssyMap:{},
				loading: false,
				//需要给分页组件传的信息
				paginations: {
					total: 0, // 总数
					pageIndex: 1, // 当前位于哪页
					pageSize: 10, // 1页显示多少条
					pageSizes: [5, 10, 15, 20], //每页显示多少条
					layout: "total, sizes, prev, pager, next, jumper" // 翻页属性
				}
			}
		},
		activated(){
			this.userInfo = JSON.parse(localStorage.getItem(getToken('token'))).userKeyInfo;
			// 初始化searchParams复制给emptySearchParams，减少代码重复
			this.emptySearchParams = JSON.parse(JSON.stringify(this.searchParams));
			this.search();
		    document.onkeydown = (event)=>{
		        var e = event || window.event || arguments.callee.caller.arguments[0];
		        if (e && e.keyCode == 113) {
		            this.search();
		        }
		    };
			// 每30秒查询一次
			// this.intervalQuery = setInterval(()=>{
			// 	this.search();
			// },60000)
		}, 
		// created() {
		// 	// 初始化searchParams复制给emptySearchParams，减少代码重复
		// 	// this.emptySearchParams = JSON.parse(JSON.stringify(this.searchParams));
		// },
		// 清除循环定时器
		beforeRouteLeave(to,from,next){
			clearInterval(this.intervalQuery);
			next();
		},
		mounted() {
			this.getList();
		},
		methods: {
			handleSelectionChange(val) {
				this.multipleSelection = val;
			},
			rowStyle({ row, rowIndex}) {
				return warnOutSty(row,this.nodeMap);
			},
			// 数据转换
			transformationFun(type, status) {
				return transformation.transformation(type, status);
			},
			showChange(taskno) {
				this.changeTaskNo = taskno;
				this.showChangeFlag = true;
			},
			hideChange() {
				this.changeTaskNo = "";
				this.showChangeFlag = false;
			},
			// 路由跳转
			goRoutePath(row){
				this.$router.push({ path:"/home/taskCenter/pre/directUnderwriteQueryDetail/"+ row.seqnum + "/" + row.procecode});
			},
			// 综合查询列表
			getList() {
				this.paginations.total = 0;
				this.searchParams.pageNum = this.paginations.pageIndex;
				this.searchParams.pageSize = this.paginations.pageSize;
				this.searchParams.userId = this.userInfo.account;
				this.searchParams.userName = this.userInfo.chinesename;
				// this.$store.dispatch('loading/CHANGE_LOADING', true)
				queryPreUnderApi(this.searchParams).then((res) => {
					if (res.resultCode === 0) {
						// this.$store.dispatch("loading/CHANGE_LOADING", false);
						if(res.data.list.length > 0){
							this.tableData = res.data.list;
							this.tableData.forEach(e=>{
								e.procecodeCHN = this.transformationFun("processType",e.procecode);
							})
						}else{
							this.tableData = [];
						}
						this.paginations.total = res.data.total;
					}else{
						// this.$store.dispatch("loading/CHANGE_LOADING", false);
						// this.$message({message: res.resultMsg,type: "warning",showClose: true});
					}
				}).catch((err) => {
					// this.$store.dispatch("loading/CHANGE_LOADING", false);
					// this.$message({message: "查询直联核保列表信息异常",type: "warning",showClose: true});
				});
			},
			// 每页多少条切换
			handleSizeChange(pageSize) {
				this.paginations.pageSize = pageSize;
				this.getList();
			},
			// 上下分页
			handleCurrentChange(page) {
				this.paginations.pageIndex = page;
				this.getList();
			},
			// 根据条件查询列表
			search() {
				this.paginations.pageIndex = 1;
				this.getList();
			},
			// 清除查询条件
			resetSearch() {
				this.searchParams = JSON.parse(JSON.stringify(this.emptySearchParams));
			},
			// 加锁
			addLock(){
				if(this.multipleSelection.length > 0){
					this.$store.dispatch("loading/CHANGE_LOADING", true);
					this.multipleSelection.forEach(e=>{
						// 写入当前操作员，用于与查询数据进行对比
						e.lastUpdateId = this.userInfo.account;
						e.showPage = '1';
					});
					queryLockStatusApi(this.multipleSelection).then((res) => {
						if (res.resultCode === 0) {
							// 选中的数据加锁--只传没有加锁的数据
							let isNotLock = [];
							this.multipleSelection.forEach(e=>{
								if(e.checkoutusrid == '' || e.checkoutusrid == undefined){
									e.checkoutusrid = this.userInfo.account;
									isNotLock.push(e);
								}
							});
							if(isNotLock.length > 0){
								// 调用加锁,加锁成功后跳转
								addLockApi(isNotLock).then((res) => {
									if (res.resultCode === 0) {
										this.$store.dispatch("loading/CHANGE_LOADING", false);
										this.$message({message: res.resultMsg,type: "success",showClose: true});
										// 查询数据接口
										this.getList();
									}else{
										this.$store.dispatch("loading/CHANGE_LOADING", false);
										// this.$message({message: res.resultMsg,type: "warning",showClose: true});
									}
								}).catch((err) => {
									this.$store.dispatch("loading/CHANGE_LOADING", false);
									// this.$message({message: "加锁时发生异常！",type: "warning",showClose: true});
								});
							}else{
								this.$store.dispatch("loading/CHANGE_LOADING", false);
								this.$message({message: "所选数据均已加锁！",type: "warning",showClose: true});
							}
						}else{
							this.$store.dispatch("loading/CHANGE_LOADING", false);
							// this.$message({message: res.resultMsg,type: "warning",showClose: true});
						}
					}).catch((err) => {
						this.$store.dispatch("loading/CHANGE_LOADING", false);
					});
				}else{
					this.$message({message: "您当前未选中数据",type: "warning",showClose: true});
				}
			},
			// 解锁
			unLock(){
				if(this.multipleSelection.length > 0){
					// 选中的数据解锁
					this.multipleSelection.forEach(e=>{
						// 写入当前操作员，用于与查询数据进行对比
						e.lastUpdateId = this.userInfo.account;
					});
					unLockApi(this.multipleSelection).then((res) => {
						if (res.resultCode === 0) {
							this.$store.dispatch("loading/CHANGE_LOADING", false);
							this.$message({message: res.resultMsg,type: "success",showClose: true});
							// 查询数据接口
							this.getList();
						}else{
							this.$store.dispatch("loading/CHANGE_LOADING", false);
							// this.$message({message: res.resultMsg,type: "warning",showClose: true});
						}
					}).catch((err) => {
						this.$store.dispatch("loading/CHANGE_LOADING", false);
						// this.$message({message: "解锁时发生异常！",type: "warning",showClose: true});
					});
				}else{
					this.$message({message: "您当前未选中数据",type: "warning",showClose: true});
				}
			},
		},
		computed: {
			...mapGetters(['tags']),
			reload() {
				return this.$store.state.loading.reload;
			}
		},
	}
</script>

<style lang="less" scoped>
	.fillcontain {
		padding-bottom: 0;
	}

	.contain {
		background: #fff;
		padding: 10px;
		margin-bottom: 20px;
	}

	.pagination {
		padding: 10px 20px;
		text-align: right;
	}

	.operationIcon {
		// padding: 12px;
		border: 1px solid #e5e5e5;
		border-radius: 50%;
		width: 22px;
		height: 22px;
		display: inline-block;
		cursor: pointer;
		box-shadow: 0 0 3px #f9f9f9;

		.svg-icon {
			font-size: 14px;
			fill: #68a3fc;
		}
	}

	.search_container {
		padding: 20px 20px 0 20px;
		border-top: 1px solid #e1e1e1;
	}
</style>
